
import React, { Component, PropTypes } from 'react';
import { connect } from 'dva';

import Paper from 'material-ui/Paper';
import {List, ListItem} from 'material-ui/List';
import ContentInbox from 'material-ui/svg-icons/content/inbox';
import ActionGrade from 'material-ui/svg-icons/action/grade';
import ContentSend from 'material-ui/svg-icons/content/send';
import ContentDrafts from 'material-ui/svg-icons/content/drafts';
import Divider from 'material-ui/Divider';
import ActionInfo from 'material-ui/svg-icons/action/info';

const Home = (props, context) => {

  return (
    <Paper>
      <List>
        <ListItem primaryText="占位" leftIcon={<ContentInbox />} />
        <ListItem primaryText="占位" leftIcon={<ActionGrade />} />
        <ListItem primaryText="占位" leftIcon={<ContentSend />} />
        <ListItem primaryText="占位" leftIcon={<ContentDrafts />} />
        <ListItem primaryText="占位" leftIcon={<ContentInbox />} />
      </List>
      <Divider />
      <List>
        <ListItem primaryText="占位" leftIcon={<ContentInbox />} />
        <ListItem primaryText="占位" leftIcon={<ActionGrade />} />
        <ListItem primaryText="占位" leftIcon={<ContentSend />} />
        <ListItem primaryText="占位" leftIcon={<ContentDrafts />} />
        <ListItem primaryText="占位" leftIcon={<ContentInbox />} />
      </List>
      <Divider />
      <List>
        <ListItem primaryText="测试 scroll 返回位置" leftIcon={<ContentInbox />} onTouchTap={()=>{context.router.push("/scroll")}} />
        <ListItem primaryText="测试 redux 状态是否持续" leftIcon={<ActionGrade />} onTouchTap={()=>{context.router.push("/redux")}} />
        <ListItem primaryText="修改 redux 状态值为 2" leftIcon={<ContentSend />} onTouchTap={()=>{props.dispatch({
          type: 'home/changeReduxState',
          payload: {
            reduxState: 2,
          }
        })}}/>
        <ListItem primaryText={`redux 状态值(${props.home.reduxState})`} leftIcon={<ContentDrafts />} />
        <ListItem primaryText="Inbox" leftIcon={<ContentInbox />} />
      </List>
    </Paper>
  );
};


Home.contextTypes = {

  router: PropTypes.object,

};


function mapStateToProps({ home }) {
  return {home};
}

export default connect(mapStateToProps)(Home);

